Button Groups

In Bootstrap 5, you can group multiple buttons in a single line using a button group.

To create a button group, wrap the buttons inside a div with the btn-group class

Example

Output :

Rather than setting sizes on each button individually, use .btn-group-lg for large groups or .btn-group-sm for small ones.

Output :

Vertical Button Groups

Bootstrap 5 allows you to create vertical button groups as well.

Output :

Button Groups Side by Side

By default, button groups are inline, so multiple groups appear next to each other.

Output :

Nesting Button Groups & Dropdown Menus

Nest button groups to create dropdown menus (you will learn more about dropdowns in a later chapter):

Output :